<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>绿地养护</title>
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
		<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
		<link rel="stylesheet" type="text/css" href="../../css/api.css" />
		<link rel="stylesheet" type="text/css" href="../../css/globle.css" />
		<script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script>
		<link rel="stylesheet" type="text/css" href="../../css/common.css" />
		<style>
			body {
			}
			span {
				margin: 10px;
			}
			.Tabl {
				height: 30px;
				width: 88%;
				font-size: 14px;

				text-align: left;
				margin-left: 6%;
			}
			.Td1 {
				font-weight: bold;
				color: #B8B8B8;
				width: 70px;
				font-size: 13px;
			}
			.Td2 {

				text-align: left;
				font-size: 13px;
				color: rgb(85,85,85);
			}
			.Hr {
				height: 1px;
				width: 96%;
				background-color: #D8D8D8;
				margin-left: 2%;
			}
			.Butt {
				border: 1px solid #B8B8B8;
				border-radius: 20px;
				color: #FFFFFF;
				height: 17px;
				width: 17px;
				outline: none;
			}
			.TabImg {
				height: 150px;
				width: 96%;
				margin-left: 2%;
				border: 10px solid #D8D8D8;
			}
			.TdImg1 {
				height: 110px;
				width: 90px;
			}
			.TdImg2 {
				height: 110px;
				width: 90px;
			}
			.ButAdd {
				height: 110px;
				width: 100px;
				font-size: 100px;
				color: #FFFFFF;
				background-color: #B8B8B8;
			}
			.TabL {
				height: 75px;
				width: 88%;
				font-size: 16px;
				font-weight: bold;
				text-align: left;
				margin-left: 6%;
			}
			.ButL {
				height: 40px;
				width: 100%;
				background-color: #D0D0D0;
				position: fixed;
				bottom: 0;
			}
			.Td3 {
				text-align: center;
				width: 50%;
			}
			select {
				appearance: none;
				-moz-appearance: none;
				-webkit-appearance: none;
				border: none;
				background:none;
			}
		</style>
	</head>
	<body>

		<table class="Tabl">
			<tr >
				<td class="Td1">名称</td>
				<td class="Td2" id="huname">
				</td>
			</tr>
		</table>
		<hr class="Hr"/>
		<table class="Tabl">
			<tr>
				<td class="Td1">类型</td>
				<td class="Td2" id="species">
				</td>
			</tr>
		</table>

		<hr class="Hr"/>
		<table class="Tabl">
			<tr>
				<td class="Td1">树高</td>
				<td class="Td2" id="treeheight">
				</td>
			</tr>
		</table>
		<hr class="Hr"/>
		<table class="Tabl">
			<tr>
				<td class="Td1">冠幅</td>
				<td class="Td2" id="guanfu">
				</td>
			</tr>
		</table>
		<hr class="Hr"/>
		<table class="Tabl">
			<tr>
				<td class="Td1">胸径</td>
				<td class="Td2" id="breastdiameter">
				</td>
			</tr>
		</table>
		<hr class="Hr"/>
		<table class="Tabl">
			<tr>
				<td class="Td1">地径</td>
				<td class="Td2" id="grounddiameter">
				</td>
			</tr>
		</table>
		<hr class="Hr"/>
		<table class="Tabl">
			<tr>
				<td class="Td1">数量</td>
				<td class="Td2" id="quantity">
				</td>
			</tr>
		</table>
		<hr class="Hr"/>
		<table class="Tabl">
			<tr>
				<td class="Td1">面积</td>
				<td class="Td2" id="area">
				</td>
			</tr>
		</table>

		<hr class="Hr"/>
		<table class="Tabl">
			<tr>
				<td class="Td1">密度</td>
				<td class="Td2" id="density">
				</td>
			</tr>
		</table>
		<hr class="Hr"/>
		<table class="Tabl">
			<tr>
				<td class="Td1">备注</td>
				<td class="Td2" id="remarks">

				</td>
			</tr>
		</table>
		<hr class="Hr"/>
		<div style="padding: 10px;">
			<!-- <ul class="upload-ul clearfix">
				<li class="upload-pick">
					<div class="webuploader-container clearfix" id="goodsUpload"></div>
				</li>
			</ul> -->
			<img src="" id="image"width= 335;height= 350;/>
		</div>
		<!-- <hr class="Hr"/>
		<table class="Tabl">
			<tr>
				<td class="Td1">补充信息</td>
			</tr>
		</table>
		<hr class="Hr"/>
		<table class="TabL">
			<tr>
				<td>				<textarea rows="4" cols="35" placeholder="填写你的其他内容描述！"></textarea></td>
			</tr>
		</table> -->
		<!-- <table class="ButL">
		<tr>
		<td class="Td3"><button>◁</button></td>
		<td class="Td3"><button>▷</button></td>
		</tr>
		</table> -->

	</body><script src="../../script/webuploader.min.js"></script>
	<script src="../../script/diyUpload.js"></script>
	<script src="../../script/common.js"></script>
	<script src="../../script/vue.js"></script>
	<script src="../../script/jquery.js"></script>
	<script type="text/javascript" src="../../script/api.js"></script>
	<script type="text/javascript">
		apiready = function() {
		var	id = api.pageParam.id;

					$.ajax({
						type : "post",
						//async : false, //同步执行
						url : BaseServiceUrl+"mobile/plant/view.json",
						data : {
						id :id
						},
						dataType : "json", //返回数据形式为json
						success : function(result) {



							$("#huname").html(result.data.name);
							$("#species").html(result.data.plantType.name);
							$("#treeheight").html(result.data.treeheight);
							$("#guanfu").html(result.data.guanfu);
							$("#breastdiameter").html(result.data.breastdiameter);
							$("#grounddiameter").html(result.data.grounddiameter);
							$("#quantity").html(result.data.quantity);
							$("#area").html(result.data.area);
							$("#density").html(result.data.density);
							$("#up_time").html(result.data.up_time);
							$("#remarks").html(result.data.remarks);


							//var ad=result.data.hundredplant;
						//alert(ad);
//								find(ad);

						}
					});


		};


		function find (id){

			$.ajax({
						type : "post",
						//async : false, //同步执行
						url : BaseServiceUrl+"mobile/patrol/plantDetailed1.json",
						data : {
						id :id
						},
						dataType : "json", //返回数据形式为json
						success : function(result) {


							$("#alias").html(result.data.alias);
							$("#genus").html(result.data.genus);
							$("#family").html(result.data.family);
							$("#division").html(result.data.division);
							$("#kingdom").html(result.data.kingdom);
							$("#species1").html(result.data.species);
//							$("#image").attr("src","http://192.168.43.149:8080/images/"+result.data.image);
							$("#image").attr("src","http://180.76.150.7:8080/linyi/images/"+result.data.image);

						}
					});
			}
		//选择正常或者异常
		flag = "btn1";
		function btn1() {
			document.getElementById("btn2").style.color = "#FFFFFF";
			document.getElementById("btn1").style.color = "#FFFFFF";
		}

		function btn2() {
			document.getElementById("btn1").style.color = "#FFFFFF";
			document.getElementById("btn2").style.color = "#FFFFFF";
		}

		function btn(num) {
			if (num == 1) {
				document.getElementById(flag).style.color = "#FFFFFF";
				document.getElementById(flag).style.backgroundColor = "#FFFFFF";
				document.getElementById("btn1").style.color = "#FFFFFF";
				document.getElementById("btn1").style.backgroundColor = "#FF8C00";
				flag = "btn1";
			}
			if (num == 2) {
				document.getElementById(flag).style.color = "#FFFFFF";
				document.getElementById(flag).style.backgroundColor = "#FFFFFF";
				document.getElementById("btn2").style.color = "#FFFFFF";
				document.getElementById("btn2").style.backgroundColor = "#FF8C00";
				flag = "btn2";
			}
		}
	</script>
</html>
